/* General */
html { background:#222222; color:#333; font-family:arial; }
a { text-decoration: none; color: #587478; }
a:hover { text-decoration: underline; }
h1 { font-size: 2em; color:#9aa57c; }
h2, h2 a { color:#9aa57c; font-size: 1.6em; text-decoration: none; }
h3 { font-size: 1.20em; color:#9aa57c; }
h4 { font-size: 1.1em; color:#9aa57c; }
.clear { clear: both; }
img.floatLeft { float: left; }
img.floatRight { float: right; clear: right; margin: 0 0 20px 20px; }
.fullContentWrapper { padding: 0 20px; }
.syntaxhighlighter { overflow:auto; }
/* Header */
.pageHeader { background:url('http://joelabrahamsson.com/styles/gfx/gradient-backgrounds.png') repeat-x 0 top; display:block; height:220px; width:100%; position:relative; }
.pageHeader .bg-5 { background:url('http://joelabrahamsson.com/styles/gfx/bg-5.png') repeat-x 30% bottom; overflow: hidden; display:block; height:220px; width:100%; z-index:5; }
.pageHeader .bg-4 { background:url('http://joelabrahamsson.com/styles/gfx/bg-4.png') repeat-x 15% bottom; display:block; position: absolute; top: 0px; height:220px; width:100%; z-index:5; }
.pageHeader .bg-3 { background:url('http://joelabrahamsson.com/styles/gfx/bg-3.png') repeat-x 10% bottom; display:block; height:220px; width:100%; z-index:2; overflow: hidden; }
.pageHeader .bg-2 { background:url('http://joelabrahamsson.com/styles/gfx/bg-2.png') repeat-x 2% bottom; display:block; height:220px; width:100%; z-index:5; }
.pageHeader .bg-0 { background:url('http://joelabrahamsson.com/styles/gfx/bg-0.png') repeat-x -10% bottom; display:block; height:220px; width:100%; z-index:5; }
.pageHeader .joel { opacity:1; bottom:0px; color:#FFFFFF; font-family:arial; font-size:2em; font-weight:bold; left:0; position:absolute; white-space:nowrap; z-index:1; padding:0 0px; }
.pageHeader .logoContainer { width: 100%; padding-left: 180px; height: 0; }
.pageHeader .logoWrapper { width: 100%; position: relative; height: 40px; margin:0 auto; min-width:980px; max-width:1552px; }
.pageHeader .logoContainer .logo { margin-top: 80px; font-size: 42px; font-family: arial,verdana,sans-serif; opacity:1; bottom:85px; color:#FFFFFF; font-weight:bold; white-space:nowrap; z-index:10; }
.pageHeader .logoContainer .tagLine {  opacity:1; float: left; margin-top: 129px; color:#dcd09f; font-family:arial; width: 450px; font-size:0.9em; font-weight:bold; letter-spacing: normal; z-index:1; }

/* About box */
.headerContent { margin: 0 auto 0 auto; min-width:980px; max-width:1230px; }
.greetingBox { background: #ffffff; margin-right: 0px; letter-spacing: normal; position: relative; float: right; opacity:0.95; filter: alpha(opacity = 95);
padding: 10px 20px; width:377px; height: 130px; color: #000; border: 1px solid #acbdaf; margin-top: 15px; }
.greetingBox h4 { font-size: 1.5em; color: #000; }
.greetingBox p { width: 270px; float: left; }
.greetingBox img { float: left; margin: 0 0px 10px 10px; }

/* Main menu */
.pageNav { background:url('http://joelabrahamsson.com/styles/gfx/pagenav-bg.png') repeat; width:100%; position:absolute; z-index: 10; bottom:0; height: 40px; }
.pageNav ul { margin: 0 auto; min-width: 980px; max-width:1230px; }
.pageNav ul li { display:inline; }
.pageNav ul li a {  color:#eadfb1; text-decoration:none; font-weight:bold; padding:10px 20px; display:block; float:left; }
.pageNav ul li a:hover { background:#44764A; }
.pageNav .searchForm { float: right; padding: 7px 0; }
.pageNav .searchForm input { background: #44764A; border: 1px solid #333333; color: #EADFB1; font-weight: bold; padding: 2px; }

/* Page content */
.pageContentWrapper { padding: 0 20px; }
.pageContent { font-size: 1em; font-family: Arial,Verdana,sans-serif; 
     margin:20px auto 0 auto; min-width:980px; max-width:1230px; width: 100%; }
.pageContent p { margin:0 0 10px 0; }

.pageContent .contentMain { width:100%; float:left; color:#333333; margin-right:-441px; }
.pageContent .contentMain .contentMainWrapper { margin-right:441px; }

/* Primary main content */
.pageContent .contentMain .contentMainWrapper .primaryMainContent { padding:20px 20px 40px 20px; margin-bottom: 20px; background:#fff; min-height: 500px; }
.pageContent .contentMain .contentMainWrapper .primaryMainContent p { line-height: 1.6em; letter-spacing: 0.005em; }
.pageContent .contentMain .contentMainWrapper .primaryMainContent p a { text-decoration: underline; }
.pageContent .contentMain .contentMainWrapper .primaryMainContent ul { margin-bottom: 0.5em; }
.pageContent .contentMain .contentMainWrapper .primaryMainContent .syntaxhighlighter { margin-left: -20px !important; padding-right: 20px !important; }
.pageContent .contentMain .contentMainWrapper .primaryMainContent h3 { color:#000; }
.pageContent .contentMain .contentMainWrapper .primaryMainContent h4 { color:#000; }
.pageContent .contentMain .contentMainWrapper ul li { list-style-type: circle; margin: 0 0 5px 15px; }
.pageContent .contentMain .contentMainWrapper ol li { list-style-type: decimal; margin:0 0 5px 22px; }
.pageContent .contentMain .contentMainWrapper .entryInfo { display: block; margin: 0 0 10px 0px; font-size: 0.9em; }
.pageContent .contentMain .contentMainWrapper .entryInfo .commentsLink 
{ background:url('http://joelabrahamsson.com/styles/gfx/icons.png') no-repeat -600px 0; padding-left: 18px; }
.pageContent .contentMain .contentMainWrapper li.entryTeaser h2 a { font-size: 1.1em; }
.pageContent .contentMain .contentMainWrapper li.entryTeaser { margin: 0 0 20px 0; list-style-type: none; list-style-position: outside; clear: both; }
#moreLink { -moz-border-radius: 6px; -webkit-border-radius: 6px; border: 1px solid #666666; background:url('http://joelabrahamsson.com/styles/gfx/gradient-backgrounds.png') repeat-x 0 -300px; 
width: 100%; display: block; text-align: center; padding: 0.4em 0 0.4em 0; font-weight: bold; color:#9aa57c; min-height: 20px; }
#moreLink:hover { background-position: 0 -364px; border: 1px solid #888888;
text-decoration: none; }
.pageContent .contentMain .contentMainWrapper .primaryMainContent .entryFooter { margin-top: 40px; }
.pageContent .contentMain .contentMainWrapper .primaryMainContent .entryFooter .tags { float: left; }
.pageContent .contentMain .contentMainWrapper .primaryMainContent .entryFooter .commentLink { float: right; }
div#relatedEntries { float: left; clear: both; margin-top: 20px; }
.consoleOutput { background: #000; color: #fff; padding: 10px; display: block; }
.pageContent .contentMain strong { font-weight: bold; }
.pageContent .contentMain em { font-style: italic; }
/* Archive */
.pageContent .contentMain .contentMainWrapper .primaryMainContent .archiveColumn { width: 50%; float: left; }
.pageContent .contentMain .contentMainWrapper .primaryMainContent .archiveColumn ul li { font-size: 1.1em; list-style-type: none; }
.pageContent .contentMain .contentMainWrapper .primaryMainContent .archiveColumn ul li ul li { font-size: 0.9em; margin-left: 1em; }
.pageContent .contentMain .contentMainWrapper .primaryMainContent ul.archive h3 { font-size: 1em; color: #000; font-weight: bold; }
.pageContent .contentMain .contentMainWrapper .primaryMainContent ul.archive li { list-style-type: none; list-style-position: inside; }
.pageContent .contentMain .contentMainWrapper .primaryMainContent ul.archive li { background: #cccccc; letter-spacing: normal; }
.pageContent .contentMain .contentMainWrapper .primaryMainContent ul.archive li ul li { background: #dddddd; }
.pageContent .contentMain .contentMainWrapper .primaryMainContent ul.archive li ul li ul li { background: #eeeeee; }
.pageContent .contentMain .contentMainWrapper .primaryMainContent ul.archive li ul li ul li { }

/* Secondary main content */
.pageContent .contentMain .contentMainWrapper .secondaryMainContent { color:#000; }

/* Love box */
.loveBox { background: url('/styles/gfx/heart.png') no-repeat #313131; padding: 20px 20px 20px 140px; margin-bottom: 20px; color:#9aa57c; 
font-size: 1.05em; }
.loveBox a { color:#9aa57c; }
.loveBox a { background:url('/styles/gfx/loveactions.png') no-repeat; padding-left: 20px; }
.loveBox a#dotnetkicksAction { background-position: 0 -24px; }
.loveBox a#diggAction { background-position: 0 -48px; }
.loveBox a#twitterAction { background-position: 0 -72px; }
.loveBox a#deliciousAction { background-position: 0 -96px; }
.loveBox a#rssAction { background-position: 0 -120px; }
.loveBox h4 { font-size: 1.2em; margin-bottom: 0.6em; color:#ACBDAF; }
.loveAction { display: inline; }

/* Comment list */
.pageContent .contentMain .contentMainWrapper .secondaryMainContent #comments { background: #313131; padding-top: 20px; }
.pageContent .contentMain .contentMainWrapper .secondaryMainContent #comments li
{ list-style-type: none; list-style-position: outside; clear: both; }
.pageContent .contentMain .contentMainWrapper .secondaryMainContent #comments ol { margin: 0 20px 0 20px; }
.pageContent .contentMain .contentMainWrapper .secondaryMainContent #comments h2 { margin: 0 0 10px 20px; font-size: 1.6em; }
.pageContent .contentMain .contentMainWrapper .secondaryMainContent #comments li 
{ position: relative; margin: 0 0 20px 0; width: 100%; float: left; margin-left: 122px; }
.pageContent .contentMain .contentMainWrapper .secondaryMainContent #comments li .commentAuthor 
{ float: left; width: 80px; margin-left: -122px; overflow: hidden; }
.pageContent .contentMain .contentMainWrapper .secondaryMainContent #comments li .commentAuthor p 
{ font-size: 0.8em; color: #ACBDAF; margin: 2px 0 0 0; letter-spacing: normal; }
.pageContent .contentMain .contentMainWrapper .secondaryMainContent #comments li .commentAuthor p a 
{ color: #ACBDAF; font-weight: bold; }
.pageContent .contentMain .contentMainWrapper .secondaryMainContent #comments li .commentAuthor p .time { display: block; font-size: 0.85em; }
.pageContent .contentMain .contentMainWrapper .secondaryMainContent #comments li .commentContent
{ -moz-border-radius: 3px; -webkit-border-radius: 3px; padding: 10px; position: relative; background: #fff; min-height: 44px; 
border: 1px solid #acbdaf; margin-right: 122px; }
.pageContent .contentMain .contentMainWrapper .secondaryMainContent #comments li .commentContent .commentArrow 
{ height: 31px; width: 32px; position: absolute; left: -32px; top: 10px; background: url('/styles/gfx/comment_arrow.png'); }
.pageContent .contentMain .contentMainWrapper .secondaryMainContent #comments li .commentContent .commentQuoute, 
#commentForm div#previewBox .commentQuoute
{ background:#eeeeee; padding: 10px; }
.pageContent .contentMain .contentMainWrapper .secondaryMainContent #comments li .commentContent .commentQuoute cite, 
#commentForm div#previewBox .commentQuoute cite
{ font-style: italic; display: block; }

/* Add comment form */
#commentForm input[type="text"].field-validation-error { border: 1px solid red; background-color: #ffeeee; }
#commentForm label.field-validation-error { color: #ff0000; float: right; }
.input-validation-error { border: 1px solid red; background-color: #ffeeee; }
.validation-summary-errors, #commentForm input[type="text"] .input-validation-error, #commentForm textarea .input-validation-error 
{ font-weight: bold; color: red; }
#comments .validation-summary-errors li { background: none; }
#addComment { background: #3d3d3d; padding: 20px 0 20px 0; margin-bottom: 20px; }
#addComment h3 { font-size: 1.6em; }
#addCommentWrapper { width: 60%; min-width: 300px; margin: 0 auto; }
#commentForm label { display: block; float: left; line-height: 1.5em; color: #9aa57c; }
#commentForm .checkBoxWithLabel { float: left; margin: 0 0 0.5em 0; }
#commentForm input[type="checkbox"] { display: inline; }
#commentForm .checkBoxWithLabel label { float: none; display: inline; }
#commentForm input[type="text"], #commentForm textarea, #commentForm div#previewBox { display: block; float: left; clear: both; 
width: 100%; padding: 5px; margin: 0 0 0.5em 0; border: 2px solid #acbdaf; }
#commentForm input[type="text"]:focus, #commentForm textarea:focus { background: #e6ede7; }
#commentForm textarea { height: 110px; font-size: 16px; }
#commentForm p.information { color: #9aa57c;  float: left; display: block; font-size: 0.75em; }
#commentForm .previewLink 
{ color: #9aa57c; text-decoration: underline; font-size: 0.9em; float: right; width: 100%; text-align: right; margin-right: -12px; }
#commentForm div#previewBox { background:#fff; min-height: 110px; }
#commentForm div#previewBox p { color:#000; }

/* Search results */
.pageContent .contentMain .contentMainWrapper ol.searchResults li { margin-bottom: 20px; }
.pageContent .contentMain .contentMainWrapper ol.searchResults li h3 a { text-decoration: underline; }

/* Right column */
.pageContent .contentSec { width:420px; float:right; color:#acbdaf; margin-left: 0px; }
.pageContent .contentSec .box {  padding: 20px; margin-bottom: 20px; background: #333333 url('http://joelabrahamsson.com/styles/gfx/gradient-backgrounds.png') repeat-x 0 -482px; }
.pageContent .contentSec .box h4 { font-size: 1.4em; margin-top: 6px; margin-bottom: 0.4em; }
.pageContent .contentSec a { color: #9aa57c; }
.pageContent .contentSec .box .icon { float: right; width: 100px; height: 100px; background: url('http://joelabrahamsson.com/styles/gfx/icons.png') no-repeat; }
.pageContent .contentSec .box a.readMoreLink { float: right; }
.pageContent .contentSec .box li { margin-bottom: 0.5em; }
#twitterFeed span.icon { background-position: -100px 0; }
#twitterFeed ol li { margin: 0 0 0.8em 0; }
#twitterFeed ol li .timestamp { font-size: 0.7em; display: inline-block; }
#latestComments span.icon { background-position: -200px 0; }
#latestComments ol li { margin: 0 0 0.5em 0; }
#aboutTheSite span.icon { background-position: -300px 0; }
#deliciousFeed span.icon { background-position: -400px 0; }
#deliciousFeed ol li { margin: 0 0 0.5em 0; }
#favoriteBlogs span.icon { background-position: -500px  0}
#favoriteBlogs ol li { margin: 0 0 0.5em 0; }

/* Footer */
#footer { color:#eadfb1; background: url('http://joelabrahamsson.com/styles/gfx/bg-5.png') repeat-x 0 top; min-width:980px; display:block; 
padding-top: 87px; width:100%; position:relative; margin-top: 20px; }
#footerContentWrapper { background: #629261; display:block; float: left; width:100%; }
#footerContent { margin:10px auto 10px auto; width: 100%; min-width:940px; max-width:1230px; }
#footerContent p { margin: 5px 0 5px 20px; font-size: 0.9em; color: #222222; }
#footerContent h4 { color:#eadfb1; font-size: 1.45em; }
#footerContent h5 { color:#222222; font-size: 1em; font-weight: bold; }
#footerContent .column { width: 30%; margin-left: 3%; float: left; }
#footerContent .column.first { margin-left: 20px; }
#footerContent ol li { margin-bottom: 0.5em; }
#footerContent ul li { display: inline; }
#footerContent ul li { display: inline; }
#footerContent ul.archiveLinks li { margin-right: 0.5em; }
#footerContent ul.archiveLinks { margin-bottom: 0.5em; }
#footerContent li.tagWeight1 { font-size: 0.8em; }
#footerContent li.tagWeight2 { font-size: 0.95em; }
#footerContent li.tagWeight3 { font-size: 1.1em; }
#footerContent li.tagWeight4 { font-size: 1.25em; }
#footerContent a { color: #222222; }
#footerFooter { display: block; clear: both; margin-top: 20px; float: left; }
